<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no"/>
    <title>我的金豆</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css"/>
    <link rel="stylesheet" type="text/css" href="../css/aui-flex.css"/>
    <!-- <link rel="stylesheet" type="text/css" href="../css/style.css" /> -->
    <style>
        body {
            font-size: 14px;
        }

        footer.aui-nav {
            z-index: 99999;
        }

        header.aui-bar {
            background: #fff;
        }

        .aui-title {
            color: #000;
        }

        .aui-nav .aui-bar-tab .active .aui-iconfont, .aui-nav .aui-bar-tab .active p {
            color: #ff3333 !important;
        }

        .active {
            color: #ff3333 !important;
        }

        .aui-tab-nav li.active {
            color: #ff3333;
            border-bottom: 2px #ff3333 solid;
        }

        .aui-bar .aui-iconfont {
            color: #000;
        }

        .my-list {
            width: 100%;
            text-align: center;
            overflow: hidden;
            margin: 0;
            color: #000;
        }

        .haderUl li:after {
            border: none !important;
        }

        .my-list li {
            padding: 0 15px;

        }

        .my-list li span {
            float: left;
            display: block;

        }

        .my-list li span:nth-of-type(1) {
            width: 40%;
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;

        }

        .my-list li span:nth-of-type(3), .my-list li span:nth-of-type(2) {
            width: 30%;
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;

        }

        .my-list li {
            line-height: 45px;
            height: 45px;
            font-size: 12px;
        }
    </style>
</head>
<body>
<div class="aui-content">
    <ul class="aui-list-view">
        <li class="aui-list-view-cell" >
            <div class="aui-arrow-right">
                <i class="aui-iconfont radius-50 aui-bg-danger aui-icon-like"></i>我的金豆
                <span class="aui-pull-right aui-margin-r-15">10000</span>
            </div>
        </li>
    </ul>
    <div class="aui-content-padded">
    <div class="aui-btn aui-btn-sm aui-btn-block aui-btn-info aui-padded-0 " tapmode onclick="sellerBeans()">出售金豆</div>
    </div>
</div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/jquery-1.11.3.js"></script>
<script type="text/javascript" src="../script/aui-dialog.js"></script>
<script type="text/javascript">
    apiready = function () {
        api.parseTapmode();
        var mobile = api.pageParam.mobile;
        var header = $api.dom('header');
        //$api.fixStatusBar(header);
        api.setStatusBarStyle({
            style: 'light'
        });

    }
    function sellerBeans() {
        var dialogBox = api.require('dialogBox');
        dialogBox.input({
            keyboardType: 'number',
            texts: {
                title: '出售金豆',
                placeholder: '输入金豆数量',
                leftBtnTitle: '取消',
                rightBtnTitle: '确定'
            },
            styles: {
                bg: '#fff',
                corner: 2,
                w: 300,
                h: 240,
                title: {
                    h: 60,
                    alignment: 'center',
                    size: 14,
                    color: '#000'
                },
                input: {
                    h: 60,
                    marginUD: 6,
                    textSize: 14,
                    textColor: '#000'
                },
                dividingLine: {
                    width: 0.5,
                    color: '#696969'
                },
                left: {
                    bg: 'rgba(0,0,0,0)',
                    color: '#007FFF',
                    size: 12
                },
                right: {
                    bg: 'rgba(0,0,0,0)',
                    color: '#007FFF',
                    size: 12
                }
            }
        }, function(ret) {
            api.alert({
                msg: JSON.stringify(ret)
            });
//            if (ret.eventType == 'left') {
//                var dialogBox = api.require('dialogBox');
//                dialogBox.close({
//                    dialogName: 'input'
//                });
//            }
        });
    }
</script>
</html>
